@form-prefix-cls: ~"@{sta-prefix}-form";

.@{form-prefix-cls} {
    &-item {
        margin-bottom: 20px;
        line-height: 43px;
        position: relative;
        &-error {

            .@{sta-prefix}-input,
            .@{sta-prefix}-select,
            .@{sta-prefix}-date-picker-input {
                border: solid 1px @error-color;
                outline: 0;
                &:focus,
                &-focused {
                    outline: 0;
                    border-color: @error-color;
                    box-shadow: 0 0 0 2px tint(@error-color,80%);
                }
            }
        }

        &-required {
            .@{form-prefix-cls}-label::before {
                content: "*";
                color: @error-color;
                display: inline-block;
                margin-right: 4px;
                font-size: 14px;
                line-height: 1;
            }
        }
    }

    &-error {
        color: @error-color;
        line-height: 1;
        position: absolute;
        opacity: 0;
        transition: opacity .2s ease-in-out;

        &-tip {
            opacity: 1;
        }
    }

    &-label {
        vertical-align: middle;
        padding: 0 12px 0 0;
        float: left;
    }

    &-label-right {
        .@{form-prefix-cls}-label {
            text-align: right;
        }
    }

    &-label-left {
        .@{form-prefix-cls}-label {
            text-align: left;
        }
    }

    &-content {
        vertical-align: middle;
    }

    &-inline {
        .@{form-prefix-cls}-item {
            display: inline-block;
        }

        .@{form-prefix-cls}-content {
            margin-left: 40px;
        }

    }
}